<template>
	<view class="myMain">
		<!-- <index-bar-fixed title="个人中心" :bg="false"></index-bar-fixed> -->
		<view class="topBackG">
			<view class="loginArea">
				<view class="left_login">
					<view class="" v-if="myAvatar">
						<u-avatar size="120" :src="myAvatar"></u-avatar>
					</view>
					<view class="avatar" v-if="nickName!=='未登录'  && avatar.length == 0">
						<view class="av_img">
							<view class="default_letter" :class="{man:sex == '0',women:sex !== '0'}">
								{{nickName ? nickName.slice(0,1) : ''}}
							</view>
						</view>
					</view>
					<view class="login_status" v-if="!zhichengName" @click="goLogin">
						{{nickName ? nickName : '已登录(待完善资料)'}}
					</view>
					<view class="logind" v-if="zhichengName">
						<view class="">
							{{nickName}}
						</view>
						<view class="job">
							{{zhichengName}}
						</view>
					</view>
				</view>
				<view class="right_login" @click="goQr">
					<u-image width="48rpx" height="48rpx" :src="qrIcon"></u-image>
				</view>
			</view>
			<view class="list_box">
				<view class="list_line" @click="nav(v.url)" v-for="v in navList" :key="v.title">
					<view class="list_line_left">
						<view class="">
							<u-image width="40rpx" height="40rpx" :src="v.icon"></u-image>
						</view>
						<view class="list_line_left_text">
							{{v.title}}
						</view>
					</view>
					<view class="">
						<u-icon name="arrow-right" size="28" color="#CCCCCC"></u-icon>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		zhicheng,
		getInfo
	} from '@/api/index.js'
	import {
		checkToken,
		checkAuth
	} from '@/utils/index.js'
	export default {
		// name:'my',
		data() {
			return {
				navList: [{
						title: '我的信息',
						url: 'my',
						icon: require('@/static/icon/my_information@2x.png')
					},
					{
						title: '我的团队',
						url: 'team',
						icon: require('@/static/icon/my_team@2x.png')
					},
					// {
					// 	title: '关于我们',
					// 	url: 'about',
					// 	icon: require('@/static/icon/About Us@2x.png')
					// },
					//{title:'上传图片',url:'postimg',icon:require('@/static/icon/About Us@2x.png')},
					// {title:'企业数据同步',url:'dataBase',icon:require('@/static/icon/Enterprise data synchronization@2x.png')},
					// {title:'通讯录',url:'connect',icon: require('@/static/icon/About Us@2x.png')},
					// {title:'分享',url:'share',icon:require('@/static/icon/About Us@2x.png')},
					{
						title: '设置',
						url: 'set',
						icon: require('@/static/icon/set@2x.png')
					},
				],
				defalutImg: '',
				avatar: '',
				qrIcon: require('@/static/img/QRcode_icon.png'),
				userIcon: require('@/static/icon/my_information@2x.png'),
				team: require('@/static/icon/my_team@2x.png'),
				dataBase: require('@/static/icon/Enterprise data synchronization@2x.png'),
				about: require('@/static/icon/About Us@2x.png'),
				nickName: '未登录',
				JobList: [],
				zhichengName: '',
				token: '',
				infoList: '',
				sex: ''
			}
		},
		computed: {
			myAvatar() {
				if (this.avatar) { //有头像直接显示头像
					return this.defalutImg = this.avatar
				}
				if (this.nickName == '未登录') { //没有nickname，说明没登录，显示默认logo
					return this.defalutImg = require('@/static/img/Login_logo.png')
				} else { //有昵称说明登陆过，到这一步说明没有些，就显示
					return ''
				}
			}
		},
		async onReady() {
			// uni.setNavigationBarTitle({
			// 	title: '我的',
			// 	 backgroundColor: '#ff0000',
			// });
			await this.getJobList()
			//console.log();
		},
		onShow() {
			this.getJobList()
		},
		mounted() {
			//this.$on('getJobList',this.getJobList)
		},
		methods: {
			
			async userInfo() {
				if (!this.token) return
				// const myInfo = uni.getStorageSync('userinfo')
				// if(myInfo){  //有缓存在缓存里取
				// 	if (myInfo?.user?.avatar) {
				// 		this.defalutImg = myInfo.user.avatar
				// 		this.avatar = myInfo.user.avatar
				// 	}else{
				// 		this.avatar = require('@/static/img/Login_logo.png') 
				// 	}
				// 	this.nickName = myInfo?.user?.nickName
				// 	this.sex =  myInfo?.user?.sex
				// 	this.infoList = myInfo
				// 	return
				// }
				let res = await getInfo() //没缓存再去接口里取
				if (res.code == 200) {
					uni.setStorageSync('userinfo', res)
					uni.setStorageSync('isLogin', true) //已登录
					//let r = uni.getStorageSync('userinfo')
					this.infoList = res
					//console.log(this.infoList,'infoList');
					if (res?.user?.avatar) {
						this.defalutImg = res.user.avatar
						this.avatar = res.user.avatar
					} else {
						this.avatar = ''
					}
					this.nickName = res?.user?.nickName
					this.sex = res?.user?.sex
					//console.log(res);
				} else {
					uni.setStorageSync('isLogin', false) //未登录
				}
			},
			goQr() {
				//console.log(this.$u);
				if (!checkToken()) return
				if(!checkAuth()) return
					uni.navigateTo({
						url: '/pages/my/qr'
					})
				//if (!checkAuth()) return
				// if (this.infoList.user.cardUrl && this.infoList?.user?.cardUrl !== undefined) {
				// 	uni.navigateTo({
				// 		url: '/pages/login/qr'
				// 	})
				// } else {
				// 	this.userInfo()
				// 	this.$u.toast('请先在智能名片创建个人活码')
				// }

			},
			nav(item) {
				if (item == 'my') {
					if (!checkToken()) return
					if (!checkAuth()) return
					uni.navigateTo({
						url: '/pages/my/index'
					});
				}
				if (item == 'team') {
					if (!checkToken()) return
					if (!checkAuth()) return
					uni.navigateTo({
						url: '/pages/team/index'
					});
					//console.log('22')
				}
				if (item == 'dataBase') {
					if (!checkToken()) return
					if (!checkAuth()) return
					uni.navigateTo({
						url: '/pages/my/sync'
					});
					//console.log('33')
				}
				
				if (item == 'postimg') {
					uni.navigateTo({
						url: '/pages/index/postimg'
					});
				}
				if (item == 'connect') {
					if (!checkToken()) return
					if (!checkAuth()) return
					this.$ww.selectEnterpriseContact({
						fromDepartmentId: 0, // 必填，-1表示打开的通讯录从自己所在部门开始展示, 0表示从最上层开始
						mode: "single", // 必填，选择模式，single表示单选，multi表示多选
						type: ["department", "user"], // 必填，选择限制类型，指定department、user中的一个或者多个
						selectedDepartmentIds: [], // 非必填，已选部门ID列表。用于多次选人时可重入
						selectedUserIds: [], // 非必填，已选用户ID列表。用于多次选人时可重入
						success: function(res) {
							var selectedDepartmentList = res.result.departmentList; // 已选的部门列表
							for (var i = 0; i < selectedDepartmentList.length; i++) {
								var department = selectedDepartmentList[i];
								var departmentId = department.id; // 已选的单个部门ID
								var departemntName = department.name; // 已选的单个部门名称
							}
							var selectedUserList = res.result.userList; // 已选的成员列表
							for (var i = 0; i < selectedUserList.length; i++) {
								var user = selectedUserList[i];
								var userId = user.id; // 已选的单个成员ID
								var userName = user.name; // 已选的单个成员名称
								var userAvatar = user.avatar; // 已选的单个成员头像
							}
							//console.log(selectedDepartmentList, selectedUserList);
						}
					});
				}
				if (item == 'share') {
					//console.log(1111);
					// uni.redirectTo({
					// 	url:'/pages/my/qrtest'
					// })
				}
				if(item == 'set'){
					uni.navigateTo({
						url:'/pages/index/set'
					})
				}
				if (item == 'exit') {
					uni.showModal({
						title: '温馨提示',
						content: '请确认是否退出登录',
						cancelColor: '#333333',
						confirmColor: '#4DC0D9',
						customStyle: {
							content: 'color: #333333;' // 这里可以设置你想要的颜色
						},
						success: (res) => {
							if (res.confirm) {
								uni.removeStorageSync('token')
								uni.removeStorageSync('userinfo')
								uni.removeStorageSync('qw')
								uni.removeStorageSync('isLogin')
								uni.removeStorageSync('zhichengName')
								uni.removeStorageSync('qrUrl')
								uni.removeStorageSync('myTeam')
								this.$u.toast('正在退出登录')
								setTimeout(() => {
									uni.navigateTo({
										url: '/pages/login/index'
									})
								}, 2000)
							} else if (res.cancel) {
								return false
								//console.log('用户点击取消');
							}
						}
					});
				}
			},
			goLogin() {
				if (this.token) return //有token就不用登录了，在没完善信息情况下
				uni.navigateTo({
					url: '/pages/login/index'
				})
			},
			async getJobList() {
				const token = uni.getStorageSync('token')
				this.token = token.token
				if (!this.token) return
				this.zhichengName = uni.getStorageSync('zhichengName')
				await this.userInfo()
				//console.log(this.JobList,'job');
			}
		}
	}
</script>

<style lang="scss" scoped>
	.myMain {
		//position: fixed;
		//background: linear-gradient( 180deg, #E3FAFF 0%, #F1FCFF 20%, #F8F8F8 43%);
		min-height: 100vh;
		// width: 375px;
		// margin: 0 auto;
		background-color: #F8F8F8;
		.topBackG {
			padding-top: 20px;

			.loginArea {
				display: flex;
				align-items: center;
				justify-content: space-between;
				//margin-top: 42rpx;
				padding: 0 24rpx;

				.left_login {
					display: flex;
					align-items: center;

					.avatar {
						//border-bottom: 1px solid rgb(228, 231, 237);
						border-bottom: 1px solid #F8F8F8;
						display: flex;
						align-items: center;

						.aTitle {
							font-family: PingFang SC, PingFang SC;
							font-weight: 500;
							font-size: 32rpx;
							color: #212121;
							line-height: 38rpx;
						}

						.av_img {
							flex: 1;
							//padding-left: 100rpx;
							padding-top: 30rpx;
							padding-bottom: 30rpx;
							display: flex;
							justify-content: flex-end;
							align-items: center;

							.img_box {
								margin-right: 10rpx;
								// width: 120rpx;
								// height: 120rpx;
							}

							.default_letter {
								width: 120rpx;
								height: 120rpx;

								border-radius: 50%;
								display: flex;
								align-items: center;
								justify-content: center;
							}

							.man {
								font-family: PingFang SC, PingFang SC;
								font-weight: 800;
								font-size: 60rpx;
								color: #4DC0D9;
								line-height: 70rpx;
								background-color: #F4FDFF;
							}

							.women {
								font-family: PingFang SC, PingFang SC;
								font-weight: 800;
								font-size: 60rpx;
								color: #F1280D;
								line-height: 70rpx;
								background-color: #FFEBEB;
							}
						}
					}

					.login_status {
						padding-left: 20rpx;
						font-family: PingFang SC, PingFang SC;
						font-weight: 800;
						font-size: 48rpx;
						color: #212121;
						line-height: 56rpx;
					}

					.logind {
						padding-left: 20rpx;
						font-family: PingFang SC, PingFang SC;
						font-weight: 800;
						font-size: 48rpx;
						color: #212121;
						line-height: 56rpx;
						display: flex;
						flex-direction: column;
						padding: 4rpx 10rpx 4rpx 10rpx;
						.job {
							font-family: PingFang SC, PingFang SC;
							font-weight: 500;
							font-size: 30rpx;
							color: #333333;
							line-height: 36px;
						}
					}
				}

				.right_login {}
			}

			.list_box {
				background-color: white;
				//	margin-top: ;
				margin: 40rpx 24rpx 0 24rpx;
				border-radius: 20rpx;

				.list_line {
					display: flex;
					padding: 28rpx 24rpx;
					align-items: center;
					justify-content: space-between;

					.list_line_left {
						display: flex;

						.list_line_left_text {
							font-family: PingFang SC, PingFang SC;
							font-weight: 500;
							font-size: 32rpx;
							color: #212121;
							line-height: 38rpx;
							margin-left: 30rpx;
						}
					}

					.list_line_right {}
				}
			}
		}
	}
</style>